
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="xuejianxinokok">
<title>首页</title>
<script src="/webjars/jquery/3.5.1/jquery.js"></script>
<script src="/aa.js"></script>
</head>
<body>
<br/>
<a href="/j/index" target="_blank">jsp</a><hr>
<a href="/t/index" target="_blank">thymeleaf</a><hr>
<a href="/f/index" target="_blank">freemarker</a><hr>
	
<hr/>



<hr/>

<button type="button" id="btQueryJ">查询列表jsp</button>
<span id="aazone.zoneJ">
<!-- @end of zone [zoneJ]@ --></span>
<hr/>
<button type="button" id="btQueryT">查询列表thymeleaf</button>
<span id="aazone.zoneT">
<hr/>

<!-- @end of zone [zoneH]@ --></span>
<button type="button" id="btQueryF">查询列表freemarker</button>	
<span id="aazone.zoneF">
<!-- @end of zone [zoneF]@ --></span>


<script type="text/javascript">

$('#btQueryJ').click(function() {
	ajaxAnywhere.getAJAX('/j/list', 'zoneJ');
});
$('#btQueryT').click(function() {
	ajaxAnywhere.getAJAX('/t/list', 'zoneT');
});
$('#btQueryF').click(function() {
	ajaxAnywhere.getAJAX('/f/list', 'zoneF');
});

// https://www.jianshu.com/p/61b4860611b2 Component中使用slot的
//https://blog.csdn.net/u014752296/article/details/120522476   使用webcomponent增强/扩展原生元素
const template = document.createElement('template');
template.innerHTML = `<span id="aazone.zoneX">
<slot>slot default</slot>
<!-- @end of zone [zoneX]@ --></span>`;
class AaZone extends HTMLElement {
  constructor() {
    super();
    this._shadowRoot = this.attachShadow({ mode: open });
    this._shadowRoot.appendChild(template.content.cloneNode(true));
  }
}
window.customElements.define('aa-zone', AaZone);



</script>	
	
	
	
</body>
</html>
